<template>
    <el-breadcrumb separator-icon="ArrowRight">
<!--        <el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>-->
        <template v-for="item in routeList">
            <el-breadcrumb-item v-if="item.meta.breakLink" :to="{path: item.path}">{{item.meta.title}}</el-breadcrumb-item>
            <el-breadcrumb-item v-else>{{item.meta.title}}</el-breadcrumb-item>
        </template>
    </el-breadcrumb>
</template>

<script setup name="Breadcrumb">
    import { useRouter } from 'vue-router'
    import { onMounted, computed } from 'vue'
    const router = useRouter()
    const routeList = computed(() => {
        return router.currentRoute.value.matched    // 注意 ref 包装过的值在value中
    })
    onMounted(() => {
        // console.log(router.currentRoute)
        console.log(router.currentRoute.value)
    })
</script>

<style scoped>

</style>
